


// Layout

body{
	background: url($img-dir + "bg.png") repeat;
  @include opacity( 0 );
  @include transition( opacity, 0.4s );
  .no-js &,
  .wf-active &{
    @include opacity( 1 );
  }
}
 
img{ max-width: 100%; }
span[data-large-src]{ display: none; }



.input-screen{
	text-align: center;
	padding: 100px 50px;
	margin: 0 auto;
	@include transition( "padding", 1s );
	@media screen and (max-width: $break1 ){
		padding-top: 0
	}
	@media screen and (max-width: $break3 ){
		padding: 0 20px;
	}
	@media screen and (max-width: $break4 ){
		padding: 0 10px;
	}
}

.action-title{
	margin: 50px 0;
	font-size: 1em;
	color: #fff;
	@media screen and (max-width: $break2 ){
		margin: 20px 0;
	}
	@media screen and (max-width: $break3 ){
		margin-top: 0;
	}
	@media screen and (max-width: $break4 ){
		margin: 0 0 10px;
	}
}

.loading{
	position: absolute;
	margin: -16px;
	top: 50%;
	left: 50%;
}

.cancel,
.cancel:visited{
	color: #FFFFFF;
  display: block;
  font-size: 0.8em;
  margin: 0 auto 0;
  max-width: 400px;
  display: none;
  outline: none;
  .new-tournament &{
  	@include opacity( 0 );
  }
  &:active{
  	outline: none;
  }
}